Skip to main content

Product custom property

This flexible block handles most "free text" scenarios: single-line text, textarea, character counter, or a simple checkbox acknowledgement.

Related: Need to add fees to text inputs or checkboxes? See Custom Option Fees.

Configuration steps​

  1. Add Product custom property to your product form.
  2. Enter the Property key, heading, and optional description copy.
  3. Choose the input type:
    • Text: default single-line. If Auto switch to textarea is enabled and the max length is above 45 characters, the block automatically becomes a textarea.
    • Textarea: manually force multi-line input with optional placeholder and character counter.
    • Checkbox: great for agreement toggles; the label can display the upcharge amount if a fee product is attached.
  4. Set a Maximum characters and enable Show character count for text inputs if needed.
  5. (Optional) Link a fee product handle so ticking the checkbox or entering text triggers the add-on item. The price preview is shown in the heading or next to the checkbox label.
  6. Enable the conditional display options if this field should only appear after another property is filled in.

Shared features​

All custom option blocks share these capabilities:

  • Conditional display: Show or hide based on the value of another property using the Conditional logic settings. The block remains hidden and its inputs are disabled until the condition is met.
  • Product tag filter: Limit to products with a specific tag using the Only show when product has tag setting.
  • Width controls: Choose full or half width on tablet/desktop for easier layout mixing.
  • Fee support: When paired with the optional Custom Option Fees script, specific selections can add a hidden product to the cart. Read more in Custom Option Fees.

How to name properties​

  • The Line item property key becomes the label in the cart and order details. Use plain text such as Patch Color or Engraving.
  • Shopify automatically namespaces properties as properties[Patch Color] behind the scenes; you only need to provide the key in the block settings.
  • Reuse the same property key across languages by translating the cart label in your locale files if needed.

Customer experience​

  • Text inputs submit exactly what the shopper typed under your chosen key.
  • Required fields use native validation and the character counter updates live via lightweight Alpine-style bindings.

Troubleshooting​

  • Confirm each property has a unique key before testing. Shopify overwrites duplicate property keys with the last value submitted.
  • When fees are involved, preview the cart to ensure the correct fee product is added. Refer to Custom Option Fees for debugging tips.
  • If a conditional block never appears, double-check the comparison value spelling—it compares lowercase, trimmed text behind the scenes.

See also: